Quickstart

Get TuPerfil.net running locally in under ten minutes.

This guide walks you through cloning the project, connecting it to Supabase, and starting the development server.

You need Node.js 18 or later, npm, and a free Supabase account before you begin.

1. Clone the repository

   Clone the project to your local machine:

   git clone https://github.com/santiagodc8/tu_perfil.net.git
   cd tu_perfil.net
   
2. Install dependencies

   Install all Node.js dependencies with npm:

   npm install
   

   This installs Next.js 14, the Supabase SSR client, TipTap editor extensions, Resend, Tailwind CSS, and all other packages declared in package.json.

3. Create a Supabase project and run the migration

   1. Go to supabase.com and create a new project.
   2. Once the project is ready, open SQL Editor in the Supabase dashboard.
   3. Copy the contents of supabase/migrations/001_initial_schema.sql and run it. This creates the categories, articles, and contacts tables, enables RLS, creates the article-images storage bucket, and seeds the six initial categories.

   The remaining migration files (002_add_featured.sql through 019_ad_tracking.sql) add features incrementally. Run them in order if you want the full schema including tags, comments, newsletter subscribers, ads, and page-view analytics. You can paste them all into the SQL Editor one at a time.

   After running the migrations, go to Authentication → Users → Add user in the Supabase dashboard to create your first admin account. The handle_new_user trigger automatically assigns the admin role to the first user created.

4. Configure environment variables

   Copy the example file and fill in your Supabase credentials:

   cp .env.example .env.local
   

   Open .env.local and set the three required variables:

   .env.local

   NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
   NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
   SUPABASE_SERVICE_ROLE_KEY=your_supabase_service_role_key
   

   You can find all three values in your Supabase dashboard under Settings → API:

   Variable	Where to find it
   NEXT_PUBLIC_SUPABASE_URL	Project URL
   NEXT_PUBLIC_SUPABASE_ANON_KEY	anon / public key
   SUPABASE_SERVICE_ROLE_KEY	service_role key (keep this secret)

   Never commit .env.local to version control. The SUPABASE_SERVICE_ROLE_KEY bypasses Row Level Security and must stay server-side only.

5. Start the development server

   Run the Next.js development server:

   npm run dev
   

   Next.js starts on port 3000 by default.

6. Open the app in your browser

   You now have two surfaces running:

   URL	Description
   http://localhost:3000	Public news portal (home, articles, categories, search, contact)
   http://localhost:3000/admin	Admin dashboard (redirects to /admin/login if unauthenticated)

   Log in at /admin/login with the credentials you created in Supabase. After a successful login the middleware redirects you to /admin, where you can manage articles, categories, comments, and more.

   If you see an empty home page, it is because no published articles exist yet. Go to Admin → Noticias → Nueva noticia to create and publish your first article.

Available npm scripts

Command	Description
npm run dev	Start the development server
npm run build	Create a production build
npm run start	Run the production build locally
npm run lint	Run ESLint

Next steps

Architecture overview

Learn how the public site, admin panel, and database fit together.

Database schema

Explore all tables, RLS policies, and RPC functions.

Authentication

Understand how middleware, sessions, and roles work.

Deploy to Vercel

Ship TuPerfil.net to production in a few steps.